(WIP) scrapbox-suggestWindow-2
2021-02-01 04:12:23 No longer developed
/icons/hr.icon
code:script.js
customElements.define('suggestion-window', class extends HTMLElement {
connectedCallback() {
if (this.rendered) return;
this.render();
this.rendered = true;
}
render() {
const shadow = this.shadowRoot ?? this.attachShadow({mode: 'open'});
shadow.innerHTML = `
<style>
ul.dropdown-menu {
overflow: auto;
white-space: nowrap; /*文字列を折り返さない*/
text-align: left;
list-style: none;
border: 1px solid rgba(0,0,0,0.15);
border-radius: 4px;
box-shadow: 0 6px 12px rgba(0,0,0,0.175);
box-sizing: border-box;
}
div.dropdown {
position: absolute;
box-sizing: border-box;
}
</style>
<div id="window" class="dropdown" style="top: ${this.getAttribute('top')}px; left: ${this.getAttribute('left')}px;">
<ul class="dropdown-menu" role="menu">
</ul>
</div>`;
}
static get observedAttributes() {
}
attributeChangedCallback(name, oldValue, newValue) {
this.render();
}
hide() {
document.getElementById('window').hidden = false;
}
show() {
document.getElementById('window').hidden = true;
}
push(...items) {
}
clear() {
}
});